﻿@{
    ViewBag.Title = "SIIV - Animales";
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.Header = "Administración de Animales";
}

@model List<SIIV.Data.Animal>

<script type="text/javascript">
    $().ready(function () {
        $.ajaxSetup({
            error: function (jqXHR, textStatus, errorThrown) {
                alert(jqXHR.statustext)
                alert(jqXHR.statusText)
                alert(jqXHR.responseText)
            }
        });
    });

     //Evento que se dispara cuando el DOM esta listo para ser utilizado
    $(document).ready(function () {
        $('#AnimalPadre').prepend($('<option selected=\'true\'></option>').val(null).html('Ninguno'));
        $('#Campo').prepend($('<option selected=\'true\'></option>').val(null).html('Ninguno'));

        jQuery('#loading').ajaxStart(function () {
            jQuery(this).show();
        });

        jQuery('#loading').ajaxError(function (e, xhr, opts, error) {
            alert('La petición a la página ' + opts.url + ' ha devuelto el siguiente error: ' + xhr.status + ' - ' + error);
        });

        jQuery('#loading').ajaxStop(function () {
            jQuery(this).hide();
        });

        //Seteo los CSS Class en el validador para que actuen segun su validacion
        $.validator.addClassRules({
            'required': {
                required: true
            },
            'date': {
                required: true,
                date: true
            }
        });

        //Extiendo por jQuery los mensajes del plugin validador 
        //(sobre-escribo los ya existentes)
        $.extend($.validator.messages, {
            required: "Campo requerido",
            maxlength: jQuery.validator.format("El máximo de caracteres es {0}")
        });

        // Inicio el plugin
        $("#frmEdicion").validate({
            errorElement: "div"
        });

    });

    $(function () {
        //hover states on the static widgets
        $('ul#icons li').hover(
		    function () { $(this).addClass('ui-state-hover'); },
		    function () { $(this).removeClass('ui-state-hover'); }
	    );

        $("#FechaNacimiento").datepicker($.datepicker.regional['es']);

        $("#divEdicion").dialog({
            autoOpen: false,
            height: 510,
            width: 350,
            modal: true,
            buttons: {
                "Guardar": function () {
                    $('#frmEdicion').validate()
                    if ($('#frmEdicion').valid()) {
                        
                        $.post(
                            "/Administracion/ActualizarAnimal",
                            {
                                idAnimal: idAnimal,
                                nombre: $("#Nombre").val(),
                                sexo: $('#Sexo').val(),
                                fechaNacimiento: $('#FechaNacimiento').val(),
                                peso: $('#Peso').val(),
                                idTipoAnimal: $('#TipoDeAnimal').val(),
                                idAnimalPadre: $('#AnimalPadre').val(),
                                idEstado: $('#Estado').val(),
                                idCampo: $('#Campo').val()
                            },
                            function (data) {
                                alert(data)
                                $("#divEdicion").dialog("close");
                            }
                        );
                        
                        $('#animales').load('/Administracion/Animales');
                    }

                }
                ,
                "Cancelar": function () {
                    $(this).dialog("close");
                }
            },
            close: function () {
                ;
            }
        });

        $("#divEliminacion").dialog({
            autoOpen: false,
            height: 150,
            width: 450,
            modal: true,
            buttons: {
                "Confirmar": function () {
                    $("#divEliminacion").dialog("close");

                    $.post(
                        "/Administracion/EliminarAnimal",
                        { idAnimal: idAnimal },
                        function (data) {
                            alert(data)
                            $("#divEliminacion").dialog("close");
                        }
                    );

                    $('#animales').load('/Administracion/Animales');

                }
                ,
                "Cancelar": function () {
                    $(this).dialog("close");
                }
            },
            close: function () {
                ;
            }
        });

        $("#divEdicion").find('input').keypress(function (e) {
            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
                e.preventDefault();
                $(".ui-dialog:visible").find('.ui-dialog-buttonpane').find('button:first').click();
            }
        });

        $("#divEliminacion").find('input').keypress(function (e) {
            if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
                e.preventDefault();
                $(".ui-dialog:visible").find('.ui-dialog-buttonpane').find('button:first').click();
            }
        });
    });

    var idAnimal

    function editarAnimal(id, nombre, sexo, fechaNacimiento, peso, idCampo, idTipoDeAnimal, idAnimalPadre, idEstadoAnimal) {
        idAnimal = id
        $("#Nombre").val(nombre)
        $('#Sexo').val(sexo)
        $('#FechaNacimiento').val(fechaNacimiento)
        $('#Peso').val(peso)
        $('#TipoDeAnimal').val(idTipoDeAnimal)
        $('#AnimalPadre').val(idAnimalPadre)
        $('#Estado').val(idEstadoAnimal)
        $('#Campo').val(idCampo)
        $("#divEdicion").dialog("open")
    }

    function eliminarAnimal(id) {
        idAnimal = id
        $("#divEliminacion").dialog("open")
    }

    function Valida_Dato(e) {
        tecla = (document.all) ? e.keyCode : e.which;
        if (tecla == 8 || tecla == 0) return true;
        patron = /[1234567890,]/;
        te = String.fromCharCode(tecla);
        return patron.test(te);
    }

    function validarPeso() {
        pesoIngresado = $('#Peso').val();
        if (pesoIngresado.indexOf(",") != -1) {
            patron = /^([0-9]{1,4}[,]{0,1}[0-9]{0,3})$/;

            if (!patron.test(pesoIngresado)) {
                alert('Formato de peso inválido.');
                $('#Peso').val('');   
            }
        }
        else {
            patron = /^([0-9]{1,4})$/;

            if (!patron.test(pesoIngresado)) {
                alert('Formato de peso inválido.');
                $('#Peso').val('');
            }
        }
    }        
 </script>

@section Menu{
    @Html.Partial("Menu")
}

<div id="animales">
    @Html.Partial("AnimalesGrid")
</div>

<div id="divEdicion" title="Editar Animal" class="art-PostContent">
    @using (@Ajax.BeginForm("ActualizarAnimal", "Administracion", null, new { @id = "frmEdicion" }))
    { 
        <p>
            <b>Nombre</b><br />
            @Html.TextBox("Nombre", null, new { @class = "required", @id = "Nombre", @maxlength = 50 })
            <br />
        </p>
        <p>
            <b>Sexo</b><br />
            <select id="Sexo">
                <option value="M" title="Macho">Macho</option>
                <option value="H" title="Hembra">Hembra</option>
            </select> 
            <br />
        </p>
        <p>
            <b>Fecha de Nacimiento</b><br />
            @Html.TextBox("FechaNacimiento", null, new { @class = "date", @id = "FechaNacimiento" })
            <br />
        </p>
        <p>    
            <b>Peso</b><br />
            @Html.TextBox("Peso", null, new { @class = "required", @id = "Peso", @maxlength = 8, @onblur="validarPeso();", @onkeypress = "return Valida_Dato(event)" })
            <br />
        </p>
        <p>
            <b>Campo</b><br />
            @Html.DropDownList("Campos", ViewBag.Campos as IEnumerable<SelectListItem>, new { @id = "Campo" })
            <br />
        </p>
        <p>
            <b>Tipo de Animal</b><br />
            @Html.DropDownList("TipoDeAnimal", ViewBag.TiposDeAnimales as IEnumerable<SelectListItem>, new { @class = "required", @id = "TipoDeAnimal" })
            <br />
        </p>
        <p>
            <b>Animal Padre</b><br />
            @Html.DropDownList("AnimalPadre", ViewBag.AnimalesPadre as IEnumerable<SelectListItem>, new { @id = "AnimalPadre" })
            <br />
        </p>
        <p>
            <b>Estado</b><br />
            @Html.DropDownList("Estado", ViewBag.EstadosDeAnimal as IEnumerable<SelectListItem>, new { @class = "required", @id = "Estado" })
            <br />
        </p>
    }

    <div class="cleared">
    </div>
        
</div>

<div id="divEliminacion" title="Eliminar Animal" class="art-PostContent">
    ¿Está seguro de eliminar el animal seleccionado? La eliminación del animal se considera como su fallecimiento.
    <div class="cleared">
    </div>
</div>